<template>
  <router-view></router-view>
</template>

<script  setup>
import { onMounted } from "vue";
import { useRouter } from "vue-router"; // 引入useRouter函数
const router = useRouter(); // 获取路由实例
//--------------------方法---------------------//
// 获取鉴权
const getAuthentication = () => {
  // 校验token是否存在，如果不存在则跳转到登陆页面,否则跳转到首页
  const token = localStorage.getItem("token");

  if (!token || token.length == 0) {
    router.replace("/login");
  }
};

//-----------------生命周期------------------------//
onMounted(() => {
  getAuthentication();
});

// 解决ERROR ResizeObserver loop completed with undelivered notifications.
// 重写ResizeObserver的构造函数，并在其中定义并调用防抖函数
const debounce = (fn, delay) => {
  let timer;
  return (...args) => {
    if (timer) {
      clearTimeout(timer);
    }
    timer = setTimeout(() => {
      // 在执行前，检查所有 entry 的 target 是否仍然在文档中
      const entries = args[0]; // 假设第一个参数是 ResizeObserverEntry 数组
      if (entries && Array.isArray(entries)) {
        // 检查每个 entry.target 是否还在文档中
        const validEntries = entries.filter(
          (entry) => entry.target && document.contains(entry.target)
        );
        // 如果所有元素都无效，则跳过执行
        if (validEntries.length === 0) {
          return;
        }
        // 如果有效，则使用有效的 entries 调用回调
        fn(validEntries);
      } else {
        // 如果参数不是预期的，直接执行原函数
        fn(...args);
      }
    }, delay);
  };
};

const _ResizeObserver = window.ResizeObserver;
window.ResizeObserver = class ResizeObserver extends _ResizeObserver {
  constructor(callback) {
    callback = debounce(callback, 200);
    super(callback);
  }
};
</script>

<style lang="less">
html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}

body::-webkit-scrollbar {
  display: none; /* Safari and Chrome */
}
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  width: 100%;
  height: 100%;
}
</style>
